.border_img {
	background: #ffffff;
	border: 1px solid #e3e3e3;
	padding: 5px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
}

.web-font {
	font-size: 2em;
}

.webfont .web-font {
	font-size: 3.4em;
	line-height: 1.2em;
}

a.readon:link, 
a.readon:visited {}

p.blue {
    border-left: 3px solid #009bda;
    padding: 0 0 0 10px;
}

p.green {
    border-left: 3px solid #75a500;
    padding: 0 0 0 10px;
}

p.red {
    border-left: 3px solid #d40000;
    padding: 0 0 0 10px;
}

p.yellow {
    border-left: 3px solid #ffa200;
    padding: 0 0 0 10px;
}

p.grey {
    border-left: 3px solid #bdbdbd;
    padding: 0 0 0 10px;
}

p.bluefill {
    background: #009bda;
    display: block;
    padding: 10px;
    text-align: justify;
    color: #fff;
	text-shadow: none;
}

p.greenfill {
    background: #75a500;
    display: block;
    padding: 10px;
    text-align: justify;
    color: #fff;
	text-shadow: none;
}

p.redfill {
    background: #d40000;
    display: block;
    padding: 10px;
    text-align: justify;
    color: #fff;
	text-shadow: none;
}

p.yellowfill {
    background: #ffa200;
    display: block;
    padding: 10px;
    text-align: justify;
    color: #fff;
	text-shadow: none;
}

p.greyfill {
    background: #bdbdbd;
    display: block;
    padding: 10px;
    text-align: justify;
    color: #fff;
	text-shadow: none;
}

.quote {
	display: block;
	font-style: italic;
	padding: 10px 10px 10px 70px;
	background: url(../images/qt.png) no-repeat 0 top;
}

p.quote-left {
	display: block;
	position: relative;
	margin: 10px 0 0 10px;
	padding: 20px;
	background: #f4f4f4;
	border: 1px solid #e5e5e5;
	border-radius: 10px;
	-webkit-border-radius: 10px;
}

p.quote-left:before {
	content: '';
    position: absolute;
    left: -11px;
    top: 14px;
    width: 0;
    height: 0;
    border-top: 11px dashed transparent;
    border-bottom: 11px dashed transparent;
    border-right: 11px solid #e5e5e5;
}

p.quote-left:after {
	content: '';
    position: absolute;
    left: -10px;
    top: 15px;
    width: 0;
    height: 0;
    border-top: 10px dashed transparent;
    border-bottom: 10px dashed transparent;
    border-right: 10px solid #f4f4f4;
}

p.quote-right {
	display: block;
	position: relative;
	margin: 10px 10px 0 0;
	padding: 20px;
	background: #f4f4f4;
	border: 1px solid #e5e5e5;
	border-radius: 10px;
	-webkit-border-radius: 10px;
}

p.quote-right:before {
	content: '';
    position: absolute;
    right: -11px;
    top: 14px;
    width: 0;
    height: 0;
    border-top: 11px dashed transparent;
    border-bottom: 11px dashed transparent;
    border-left: 11px solid #e5e5e5;
}

p.quote-right:after {
	content: '';
    position: absolute;
    right: -10px;
    top: 15px;
    width: 0;
    height: 0;
    border-top: 10px dashed transparent;
    border-bottom: 10px dashed transparent;
    border-left: 10px solid #f4f4f4;
}

ul.linked,
ul.linked ul,
ul.special,
ul.special ul {
	list-style: none;
}

ul.linked li {
    background: none;
    padding: 0;
    margin: 0;
}

ul.linked li a:hover {
    margin: 0 0 0 3px;
    padding: 0 0 0 15px;
    text-decoration: none;
}

ul.linked li a {
    display: block;
    margin: 0 0 0 3px;
    padding: 0 0 0 10px;
    text-decoration: underline;
	background-repeat: no-repeat;
	background-position: left 7px;
}

ul.special li {
    margin: 0 0 0 3px;
    padding: 0 0 0 10px;
	background-repeat: no-repeat;
	background-position: left 7px;
	background-image: url(../images/special.png);
}

/** image hover effects **/

.dj-image-hover {
	display: inline-block;
	width: 100%;
}

.view {
	display: inline-block;
	max-width: 100%;
	overflow: hidden;
	position: relative;
	text-align: center;
	cursor: default;

}

.view .mask,
.view .content {
	width: 100%;
	height: 100%;
	position: absolute;
	overflow: hidden;
	top: 0;
	left: 0;
}

.view img {
	display: inline-block;
	position: relative;
	border: 1px solid #e3e3e3;
	background: #ffffff;
	padding: 2%;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	max-width: 94% !important;
}

.view h2 {
   color: #fff !important;
   text-align: center;
   position: relative;
   font-size: 1.4em !important;
   line-height: 1.2em !important;
   padding: 10px !important;
   background: rgba(0, 0, 0, 0.7);
   margin: 10px 0 0 0 !important;
}

.view h2 a:link,
.view h2 a:visited {
	color: #fff;
	border: none;
}

.view h2 a:hover {
	color: #cccccc;
}

.view p {
   font-family: "Times New Roman", Times, serif;
   font-style: italic;
   font-size: 1em;
   color: #3a3a3a;
   position: relative;
   padding: 10px;
   text-align: center;
}

.view a.readon:link,
.view a.readon:visited {
	float: none;
}

/** first effect **/

.view-first img {
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}

.view-first .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   background-color: rgba(255,255,255, 0.6);
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;
}

.view-first h2 {
   -webkit-transform: translateY(-100px);
   -moz-transform: translateY(-100px);
   -o-transform: translateY(-100px);
   -ms-transform: translateY(-100px);
   transform: translateY(-100px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}

.view-first p {
   -webkit-transform: translateY(100px);
   -moz-transform: translateY(100px);
   -o-transform: translateY(100px);
   -ms-transform: translateY(100px);
   transform: translateY(100px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}

.view-first:hover img {
   -webkit-transform: scale(1.1,1.1);
   -moz-transform: scale(1.1,1.1);
   -o-transform: scale(1.1,1.1);
   -ms-transform: scale(1.1,1.1);
   transform: scale(1.1,1.1);
}

.view-first a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}

.view-first:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}

.view-first:hover h2,
.view-first:hover p,
.view-first:hover a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
}

.view-first:hover p {
   -webkit-transition-delay: 0.1s;
   -moz-transition-delay: 0.1s;
   -o-transition-delay: 0.1s;
   -ms-transition-delay: 0.1s;
   transition-delay: 0.1s;
}

.view-first:hover a.info {
   -webkit-transition-delay: 0.2s;
   -moz-transition-delay: 0.2s;
   -o-transition-delay: 0.2s;
   -ms-transition-delay: 0.2s;
   transition-delay: 0.2s;
}

/** second effect **/

.view-second img {
   -webkit-transition: all 0.5s ease-out;
   -moz-transition: all 0.5s ease-out;
   -o-transition: all 0.5s ease-out;
   -ms-transition: all 0.5s ease-out;
   transition: all 0.5s ease-out;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}

.view-second .mask {
   background-color: #dcdcdc;
   -webkit-transform: rotate(0deg) scale(1);
   -moz-transform: rotate(0deg) scale(1);
   -o-transform: rotate(0deg) scale(1);
   -ms-transform: rotate(0deg) scale(1);
   transform: rotate(0deg) scale(1);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.3s ease-out;
   -moz-transition: all 0.3s ease-out;
   -o-transition: all 0.3s ease-out;
   -ms-transition: all 0.3s ease-out;
   transition: all 0.3s ease-out;
}

.view-second h2 {
   -webkit-transform: translateY(-200px);
   -moz-transform: translateY(-200px);
   -o-transform: translateY(-200px);
   -ms-transform: translateY(-200px);
   transform: translateY(-200px);
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}

.view-second p {
   -webkit-transform: translateY(-200px);
   -moz-transform: translateY(-200px);
   -o-transform: translateY(-200px);
   -ms-transform: translateY(-200px);
   transform: translateY(-200px);
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}

.view-second a.info {
   -webkit-transform: translateY(-200px);
   -moz-transform: translateY(-200px);
   -o-transform: translateY(-200px);
   -ms-transform: translateY(-200px);
   transform: translateY(-200px);
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}

.view-second:hover img {
   -webkit-transform: rotate(720deg) scale(0);
   -moz-transform: rotate(720deg) scale(0);
   -o-transform: rotate(720deg) scale(0);
   -ms-transform: rotate(720deg) scale(0);
   transform: rotate(720deg) scale(0);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
}

.view-second:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: translateY(0px) rotate(0deg);
   -moz-transform: translateY(0px) rotate(0deg);
   -o-transform: translateY(0px) rotate(0deg);
   -ms-transform: translateY(0px) rotate(0deg);
   transform: translateY(0px) rotate(0deg);
   -webkit-transition-delay: 0.4s;
   -moz-transition-delay: 0.4s;
   -o-transition-delay: 0.4s;
   -ms-transition-delay: 0.4s;
   transition-delay: 0.4s;
}

.view-second:hover h2 {
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   -webkit-transition-delay: 0.7s;
   -moz-transition-delay: 0.7s;
   -o-transition-delay: 0.7s;
   -ms-transition-delay: 0.7s;
   transition-delay: 0.7s;
}

.view-second:hover p {
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   -webkit-transition-delay: 0.6s;
   -moz-transition-delay: 0.6s;
   -o-transition-delay: 0.6s;
   -ms-transition-delay: 0.6s;
   transition-delay: 0.6s;
}

.view-second:hover a.info {
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   -webkit-transition-delay: 0.5s;
   -moz-transition-delay: 0.5s;
   -o-transition-delay: 0.5s;
   -ms-transition-delay: 0.5s;
   transition-delay: 0.5s;
}